//---------------------------------- 定时更新数据 ----------------------------------
setInterval(get_isworkon, 5000);

//------------ axios 获取数据 -----------
function get_isworkon() {
    axios
        .get('/d/isworking')
        .then(function (response) {
            // 取数据
            let data = response.data.working_list;
            // 组织数据
            let position_info = [];
            for (let item in data) {
                if (!data.hasOwnProperty(item)) continue;
                let info = data[item];
                let p_list = info['location'];
                let name = info['name'];
                let phone = info['phone'];
                position_info.push({
                    position: p_list[0],
                    name: name,
                    mobile: phone
                });
            }
            // 标点
            render_point(position_info);
        })
        .catch(function (error) {
            console.log(error);
        })
}

//---------- 标点 ---------------
function render_point(info_list) {
    clearSimplemarker(marker_list);
    marker_list = [];
    for (let i = 0; i < info_list.length; i++) {
        // 取数据
        let info = info_list[i];
        // 构造点
        let marker = new AMap.Marker({
            position: str_to_lnglat(info.position),
            label: {
                offset: new AMap.Pixel(30, 2),
                content: "<div class='label' style='color: black'>" + info['name'] + "</div>"
            },
            icon: get_icon('/image/4.png')
        });
        marker_event(marker, info);
        // 添加点
        map.add(marker);
        marker_list.push(marker);
    }
}

//---------- 标点添加事件 ---------------
function marker_event(marker, info) {
    // 构造绑定事件
    marker.on('click', function () {
        map.setZoom(15);
        map.setCenter(this.getPosition());
    });
    marker.on('mouseover', function () {
        // alert(i);
        title = '检测人员';
        let info_ = "<div style='color: #FFFFFF'>电话：" + info.mobile + "</div>";
        infoWindow.setContent(updateInfoWindow(info.name, info_));
        infoWindow.open(map, this.getPosition());
    });
    marker.on('mouseout', function () {
        closeInfoWindow();
    });
}

//---------- 新建信息窗口 ---------------
var title = '监测人员';
var content = '';
var infoWindow = new AMap.InfoWindow({
    isCustom: true,  //使用自定义窗体
    content: createInfoWindow(title, content),
    offset: new AMap.Pixel(16, -45)
});

//---------- 构建信息窗口 ---------------
function createInfoWindow(title, content) {
    let info = document.createElement("div");
    info.className = "custom-info input-card content-window-card";

    //可以通过下面的方式修改自定义窗体的宽高
    //info.style.width = "400px";
    // 定义顶部标题
    let top = document.createElement("div");
    let titleD = document.createElement("div");
    let closeX = document.createElement("img");
    top.className = "info-top";
    titleD.innerHTML = title;
    closeX.src = "https://webapi.amap.com/images/close2.gif";
    closeX.onclick = closeInfoWindow;

    top.appendChild(titleD);
    top.appendChild(closeX);
    info.appendChild(top);

    // 定义中部内容
    let middle = document.createElement("div");
    middle.className = "info-middle";
    middle.style.backgroundColor = 'rgb(0,0,0,0.5)';
    middle.innerHTML = content;
    info.appendChild(middle);

    // 定义底部内容
    let bottom = document.createElement("div");
    bottom.className = "info-bottom";
    bottom.style.position = 'relative';
    bottom.style.top = '0px';
    bottom.style.margin = '0 auto';
    let sharp = document.createElement("img");
    sharp.src = "https://webapi.amap.com/images/sharp.png";
    bottom.appendChild(sharp);
    info.appendChild(bottom);
    return info;
}

//动态更新信息窗口
function updateInfoWindow(title, content) {
    return createInfoWindow(title, content);
}

//关闭信息窗体
function closeInfoWindow() {
    map.clearInfoWindow();
}


/**-------------------------------------- 工具 ----------------------------------*/
//----------- 清除多余点 -----------------
var marker_list = [];

function clearSimplemarker(ob_list) {
    if (ob_list.length > 0) {
        for (let i = 0; i < ob_list.length; i++) {
            map.remove(ob_list[i]);
        }
    }
}

//----------- 处理字符串坐标 --------------
//接收字符串坐标，返回坐标对象
function str_to_lnglat(position_str) {
    let position = position_str.split(',');
    return new AMap.LngLat(parseFloat(position[0]), parseFloat(position[1]));
}

///----------- 获取样式 -------------------
//传入图片路径字符串，返回样式
function get_icon(url) {
    return new AMap.Icon({
        size: new AMap.Size(40, 40),
        image: url,
        imageSize: new AMap.Size(35, 40),
    });
}